class Main extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
            title: '',
            name: '',
            list: [],
            counts: [],
            start: 0,
            pagesize: 12,
            keyword: '',
            showswitch: !0,
            pagestart: 0,
            id: 0,
            imgsrc: "",
            cid: 0,
            type: 'FOLLOWUP',
            contents: "",
            translate:"",
            vocabulary: '',
            optionA: '',
            optionB: '',
            optionC: '',
            optionD: '',
            rightkey: '',
            audiosrc: '',
            fileaudioshow: !0,
            evalmode: 0,
            servertype: 0,
        };
    }


    inputchange(prop, e) {
        this.setState({ [prop]: e.target.value })
    }
    inputchangeradio(prop, e) {
        console.log(prop, 'prop')
        console.log(e.target.value, 'eeee')
        this.setState({ [prop]: e.target.value })
    }

    replaceraw(content) {
        return content.replace('rgb(', 'rgb').replace(new RegExp('rgb', 'g'), "rgb(");
    }
    submit() {
        var { imgsrc, title, type, contents, audiosrc, optionA, optionB, optionC, optionD, rightkey, evalmode, servertype, name } = this.state, err = '',
            that = this, imgarr = [];

        if (type == 'FOLLOWUP') {
            console.log(audiosrc, 'audiosrc');
            // if (!ueditor.hasContents()) err = '请输入跟读内容';
            if (contents == "") err = "请输入跟读内容"
            // if (!audiosrc || audiosrc == '') err = "请添加音频"
            if (!imgsrc) err = "请添加图片"
            // if (vocabulary == "") err = "请输入跟读内容音标"
            rightkey = '', optionA = '', optionB = '', optionC = '', optionD = '', title = ''
        } else {
            if (rightkey == "") err = "请选择正确答案"
            // if (optionD == "") err = "请添加选项D图片"
            // if (optionC == "") err = "请添加选项C图片"
            if (optionB == "") err = "请添加选项B图片"
            if (optionA == "") err = "请添加选项A图片"
            if (title == "") err = "请输入题目"
            contents = '', evalmode = 0, servertype = 0,translate=''
        }
        // if (!audiosrc) err = "请添加音频"
        // if (name=='') err = "请输入标题"
        if (err.length > 0) {
            alert(err);
            return
        }
        if (imgsrc) {
            if (type == 'CHOICE') {
                if (optionC == '') {
                    imgarr = imgarr.concat(imgsrc, optionA, optionB)
                } else if (optionD == '') {
                    imgarr = imgarr.concat(imgsrc, optionA, optionB, optionC)
                } else {
                    imgarr = imgarr.concat(imgsrc, optionA, optionB, optionC, optionD)
                }
                console.log(imgarr, 'aaa')
                that.uploadimg(imgarr)
            } else {
                imgarr = imgarr.concat(imgsrc)
                that.uploadimg(imgarr)
            }
        } else {
            if (type == 'CHOICE') {
                if (optionC == '') {
                    imgarr = imgarr.concat(optionA, optionB,)
                } else if (optionD == '') {
                    imgarr = imgarr.concat(optionA, optionB, optionC)
                } else {
                    imgarr = imgarr.concat(optionA, optionB, optionC, optionD)
                }
                // imgarr = imgarr.concat( optionA, optionB, optionC, optionD)
                console.log(imgarr, 'aaa')
                that.uploadimg(imgarr)
            } else {
                // imgarr = imgarr.concat(imgsrc)
                that.uploadimg(imgarr)
            }
        }


    }

    componentDidMount() {
        let that = this, { type, evalmode, servertype } = that.state
        $(`input[name="type"][value=${type}]`).prop("checked", "checked");
        $(`input[name="evalmode"][value=${evalmode}]`).prop("checked", "checked");
        $(`input[name="servertype"][value=${servertype}]`).prop("checked", "checked");
        // let UE = window.UE
        // let ueditor = UE.getEditor('ueditor', {
        //     autoHeightEnabled: true,
        //     autoFloatEnabled: true
        // });
        // ueditor.addListener("ready", function () {
        //     that.setState({ ueditor }, () => {
        //         let id = GetQueryString('id'), cid = GetQueryString('cid')
        //         if (cid > 0) {
        //             if (id != 'null' && id) {
        //                 that.setState({ id, cid }, () => {
        //                     that.freshlist()
        //                 })
        //             } else {
        //                 that.setState({ cid })
        //             }
        //         } else {
        //             window.location.href = "./testpaper.html";
        //         }
        //     });
        // }, 2);
        let id = GetQueryString('id'), cid = GetQueryString('cid')
        if (cid > 0) {
            if (id != 'null' && id) {
                that.setState({ id, cid }, () => {
                    that.freshlist()
                })
            } else {
                that.setState({ cid })
            }
        } else {
            window.location.href = "./testpaper.html";
        }

    }
    freshlist() {
        let { id } = this.state, that = this;
        Subjectgetdetail(id, res => {
            if (res.issuccess == 1) {
                var { imgsrc, ueditor, title, type, name, audiosrc, fileaudioshow, vocabulary, optionA, optionB, optionC, optionD, rightkey, evalmode, servertype } = this.state, x = res.data
                type = x.type, evalmode = x.evalmode, servertype = x.servertype
                $(`input[name=type][value=${type}]`).prop("checked", "checked");
                $(`input[name=evalmode][value=${evalmode}]`).prop("checked", "checked");
                $(`input[name=servertype][value=${servertype}]`).prop("checked", "checked");
                if (x.imgsrc) {
                    imgsrc = `${API_HEAD}imgs/${x.imgsrc}`
                }
                if (type == 'CHOICE') {
                    rightkey = x.rightkey
                    optionA = `${API_HEAD}imgs/${x.optionA}`
                    optionB = `${API_HEAD}imgs/${x.optionB}`
                    if (x.optionC) {
                        optionC = `${API_HEAD}imgs/${x.optionC}`
                    }
                    if (x.optionD) {
                        optionD = `${API_HEAD}imgs/${x.optionD}`
                    }

                    $(`input[name=rightkey][value=${rightkey}]`).prop("checked", "checked");
                } else {

                    // ueditor.setContent(that.replaceraw(decodeURIComponent(x.contents)))

                }
                if (x.audiosrc) {
                    audiosrc = `${Constant.AUDIOSRC}/${x.audiosrc}`
                    fileaudioshow = !1
                }
                this.setState({
                    title: x.title, imgsrc, type, audiosrc, fileaudioshow, optionA, contents: x.contents, optionB, optionC, optionD, rightkey, evalmode, servertype,translate:x.translate,//name:x.name,
                })

                // this.formatlist(res.list);
            }
        })
        // this.formatlist(list);

    }
    inputlist(list) {
        var inputhtml = []
        list.forEach((x, i) => {
            inputhtml.push(
                <div key={i} className="radio"><input type="radio" name="countmethod" value={x.id} id={x.id} /><label for={x.id}></label><span>{x.name}</span></div>
            )
        })
        this.setState({ inputhtml, cate: list })
    }

    setpager(pagecount, start) {
        let counts = [];
        for (let i = 1; i < pagecount + 1; i++) {
            counts.push(start + i)
        }
        this.setState({ counts })
    }
    clickpage(e) {
        let { start, pagesize } = this.state
        start = e * pagesize
        this.setState({ pagestart: e, start }, () => {
            this.freshlist(start)
        })
    }
    // 预览图片
    filechangeimg(e) {
        // this.setState({
        //     fileimgshow:!1,
        //     // uploadword: "上传",
        //     imgstate:''
        // })  
        var that = this;
        // var filedata = $('#file3')[0].files[0];
        var filedata = $('#file' + e)[0].files[0];
        let _name, _fileName;
        _name = $('#file' + e)[0].value;
        _fileName = _name.substring(_name.lastIndexOf(".") + 1).toLowerCase();
        if (_fileName !== "png" && _fileName !== "jpg" && _fileName !== "gif" && _fileName !== "jpeg") {
            alert("上传图片格式不正确，请重新上传");
        } else {
            this.setState({
                fileimgshow: !1,
                // uploadword: "上传",
                imgstate: ''
            })
            let filee = e
            var reader = new FileReader();
            reader.readAsDataURL(filedata);
            reader.onload = function (e) {
                var base64str = e.target.result;
                that.putswiperimglistdata([base64str], filee)
            }
        }
    }
    putswiperimglistdata(target, e) {
        let { imgsrc, optionA, optionB, optionC, optionD } = this.state;
        if (e == '3') {
            imgsrc = target[0]
            if (!isBase64(imgsrc)) {
                if (imgsrc.indexOf(`${API_HEAD}`) == -1) {
                    imgsrc = `${API_HEAD}imgs/${imgsrc}`

                }
            }
        } else if (e == 'A') {
            optionA = target[0]
            if (!isBase64(optionA)) {
                if (optionA.indexOf(`${API_HEAD}`) == -1) {
                    optionA = `${API_HEAD}imgs/${optionA}`

                }
            }
        } else if (e == 'B') {
            optionB = target[0]
            if (!isBase64(optionB)) {
                if (optionB.indexOf(`${API_HEAD}`) == -1) {
                    optionB = `${API_HEAD}imgs/${optionB}`

                }
            }
        } else if (e == 'C') {
            optionC = target[0]
            if (!isBase64(optionC)) {
                if (optionC.indexOf(`${API_HEAD}`) == -1) {
                    optionC = `${API_HEAD}imgs/${optionC}`

                }
            }
        } else if (e == 'D') {
            optionD = target[0]
            if (!isBase64(optionD)) {
                if (optionD.indexOf(`${API_HEAD}`) == -1) {
                    optionD = `${API_HEAD}imgs/${optionD}`

                }
            }
        }
        // imgsrc = target[0]
        // if (!isBase64(imgsrc)) {
        //     if (imgsrc.indexOf(`${API_HEAD}`) == -1) {
        //         imgsrc = `${API_HEAD}imgs/${src}`

        //     }
        // }
        this.setState({
            imgsrc, optionA, optionB, optionC, optionD
        })

    }
    // 试听音频
    filechangeaudio(e) {
        let audiosrc = $('#file0')[0].files[0];
        let _name, _fileName;
        console.log(audiosrc, 'audiosrc');
        if (audiosrc.size > 1024 * 60 * 1000) {
            alert('音频不能超过60M')
            return;
        }

        _name = $('#file0')[0].value;
        _fileName = _name.substring(_name.lastIndexOf(".") + 1).toLowerCase();
        if (_fileName !== "mp3" && _fileName !== "wma" && _fileName !== "MP1" && _fileName !== "MP2" && _fileName !== "MPEG") {
            alert("上传音频格式不正确，请重新上传");
        } else {
            this.setState({
                // uploadword: "上传",
                audiosrc,
                audiostate: ''
            })
        }
    }
    clickupload(e) {
        $('#file' + e).click();
    }
    del_img(e) {
        console.log(e, 'eeeeeeee')
        if (e == '3') {
            this.setState({
                imgsrc: '',
                fileimgshow: !0,
                imgstate: ''
            })
        } else if (e == 'A') {
            this.setState({
                optionA: ''
            })
        } else if (e == 'B') {
            this.setState({
                optionB: ''
            })
        } else if (e == 'C') {
            this.setState({
                optionC: ''
            })
        } else if (e == 'D') {
            this.setState({
                optionD: ''
            })
        } else if (e == '0') {
            this.setState({
                audiosrc: '',
                fileaudioshow: !0,
                audiostate: ''
            })
        }
    }

    // 上传图片
    uploadimg(arr) {
        let uploadimgarr = [], { audiosrc, imgsrc, title, type, contents, vocabulary, optionA, optionB, optionC, optionD, rightkey, cid } = this.state, that = this;
        if (arr.length > 0) {
            arr.forEach((x, i) => {
                if (x.indexOf(`${API_HEAD}`) == -1) {
                    if (isBase64(x)) {
                        uploadimg(x, res => {
                            if (res.issuccess == 1) {
                                x = `${API_HEAD}imgs/${res.path}`
                                uploadimgarr.push(x)
                            } else {
                                alert(res.msg)
                                err = 1
                                return;
                            }
                        })
                    }
                } else {
                    uploadimgarr.push(x)
                }
            })
        }
        if (uploadimgarr.length == arr.length) {
            that.setState({ uploadimgarr }, () => {
                if (audiosrc) {
                    that.uploadaudio(audiosrc)
                } else {
                    that.aoe()
                }
            })
            // uploadimgarr.forEach((x, i) => {
            //     if (i == 0) {
            //         imgsrc = x.replace(`${API_HEAD}imgs/`, '')
            //     }
            //     else if (i == 1) {
            //         optionA = x.replace(`${API_HEAD}imgs/`, '')
            //     } else if (i == 2) {
            //         optionB = x.replace(`${API_HEAD}imgs/`, '')
            //     } else if (i == 3) {
            //         optionC = x.replace(`${API_HEAD}imgs/`, '')
            //     } else {
            //         optionD = x.replace(`${API_HEAD}imgs/`, '')
            //     }
            // })
            // var data = { imgsrc, title, type, contents, vocabulary, optionA, optionB, optionC, optionD, rightkey, cid }

            // if (this.state.id > 0) data['id'] = this.state.id;
            // Subjectaoe(data, res => {
            //     if (res.issuccess == 1) {
            //         this.setState({ showloading: '' })
            //         alert(`${this.state.id > 0 ? '修改' : '保存'}成功`);
            //         window.location.href = "./subject.html?id=" + cid;
            //     } else {
            //         alert(res.msg)
            //     }
            // })
        } else {
            that.setState({ showloading: '' })
            alert("图片上传失败")
        }
    }
    // 上传音频
    uploadaudio(audiosrc) {
        console.log(audiosrc, 'audiosrcaudiosrcaudiosrc');
        if (audiosrc) {
            console.log('typefaudiosrc', typeof (audiosrc));

            //audiosrc.indexOf(`${Constant.AUDIOSRC}`) == -1
            if (typeof (audiosrc) == 'object') {
                uploadaudio(audiosrc, res => {
                    console.log(res, 'res');
                    if (res.success == 1) {
                        audiosrc = `${Constant.AUDIOSRC}/${res.path}`
                        this.setState({ fileaudioshow: !1, audiosrc, audiostate: 'isuploadaudio' }, () => {
                            this.aoe()
                        })

                    } else {
                        alert(res.msg)
                        err = 1
                        return;
                    }
                })
            } else {
                this.aoe()
            }
        }
    }
    aoe() {
        let { audiosrc, imgsrc, title, type, contents, optionA, optionB, optionC, optionD, rightkey, cid, uploadimgarr, evalmode, servertype, name,translate } = this.state, that = this;
        if (uploadimgarr.length > 0) {
            if (imgsrc) {
                uploadimgarr.forEach((x, i) => {
                    if (i == 0) {
                        imgsrc = x.replace(`${API_HEAD}imgs/`, '')
                    }
                    else if (i == 1) {
                        optionA = x.replace(`${API_HEAD}imgs/`, '')
                    } else if (i == 2) {
                        optionB = x.replace(`${API_HEAD}imgs/`, '')
                    }
                    else if (i == 3) {
                        optionC = x.replace(`${API_HEAD}imgs/`, '')
                    }
                    else {
                        optionD = x.replace(`${API_HEAD}imgs/`, '')
                    }
                })
            } else {
                uploadimgarr.forEach((x, i) => {
                    if (i == 0) {
                        optionA = x.replace(`${API_HEAD}imgs/`, '')
                    }
                    else if (i == 1) {
                        optionB = x.replace(`${API_HEAD}imgs/`, '')
                    } else if (i == 2) {
                        optionC = x.replace(`${API_HEAD}imgs/`, '')
                    }
                    // else if (i == 3) {
                    //     optionC = x.replace(`${API_HEAD}imgs/`, '')
                    // }
                    else {
                        optionD = x.replace(`${API_HEAD}imgs/`, '')
                    }
                })
            }
            if (optionC == '') {
                optionD = ''
            }
        }
        audiosrc = audiosrc.replace(`${Constant.AUDIOSRC}/`, '')
        // if (type == 'FOLLOWUP') {
        //     contents = that.replaceraw(encodeURIComponent(html))
        // } else {
        //     contents = ''
        // }
        if (type == 'FOLLOWUP') {
            rightkey = '', optionA = '', optionB = '', optionC = '', optionD = '', title = ''
        } else {
            contents = '', evalmode = 0, servertype = 0,translate=''
        }
        var data = { imgsrc, title, type, contents, audiosrc, optionA, optionB, optionC, optionD, rightkey, cid, evalmode, servertype,translate }

        if (this.state.id > 0) data['id'] = this.state.id;
        Subjectaoe(data, res => {
            if (res.issuccess == 1) {
                this.setState({ showloading: '' })
                alert(`${this.state.id > 0 ? '修改' : '保存'}成功`);
                window.location.href = "./subject.html?id=" + cid;
            } else {
                alert(res.msg)
            }
        })
    }
    onstatechange(e) {
        let { cid } = this.state, estate = e.target.value;
        console.log(cid, 'cid');
        console.log(e.target.value, 'e.target.value');

        if (cid == estate) return;
        this.setState({ start: 0, cid: estate }, () => {
            this.freshlist(0)
        })
    }
    totestpaper() {
        window.location.href = "./testpaper.html";
    }
    toback() {
        let { cid } = this.state
        window.location.href = "./subject.html?id=" + cid;
    }
    render() {
        let { type, imgsrc, title, contents, audiosrc, optionA, optionB, optionC, optionD, rightkey, name,translate } = this.state;

        return (
            <div className="breadLinebox">
                <div className='content_wrap panel-default content_wrap'>
                    <div className="breadLine">
                        <span>当前目录</span> > <span onClick={this.totestpaper.bind(this)} style={{ cursor: 'pointer' }}>试卷管理</span> > <span onClick={this.toback.bind(this)} style={{ cursor: 'pointer' }}>题目管理</span> > {this.state.id > 0 ? "编辑" : "新建"}题目
                    </div>
                    <div className="content form">
                        <div className="formtitle">
                            <p>{this.state.id > 0 ? "编辑" : "新建"}</p>
                        </div>
                        <div className="formbox">
                            <div className="formcontent">
                                {/* <div className="input-group">
                                    <span className="input-group-addon">标题</span>
                                    <input id='name' onChange={this.inputchange.bind(this, 'name')} value={name} type="text" placeholder='请输入标题' className="input" />
                                </div> */}
                                <div className="input-group">
                                    <span className="label input-group-addon">图片</span>
                                    <input onChange={this.filechangeimg.bind(this, '3')} type='file' id='file3' style={{ display: "none" }} />
                                    <div className=''>
                                        <img className='fileimg' src={Constant.UPLOADBTN} onClick={this.clickupload.bind(this, '3')} style={{ display: imgsrc ? "none" : "" }} />
                                        <div className="img_warp" style={{ display: imgsrc ? "" : "none" }}>
                                            <img src={imgsrc} className="img" />
                                            <img className='closeimg' onClick={this.del_img.bind(this, '3')} src='./src/img_close.png' />
                                        </div>
                                    </div>
                                </div>


                                <div className="input-group">
                                    <span className="input-group-addon">音频(建议上传的音频不超过60s)</span>
                                    <input onChange={this.filechangeaudio.bind(this, '0')} onClick={this.clickupload.bind(this, 0)} type='file' id='file0' style={{ display: this.state.fileaudioshow ? "" : "none" }} />
                                    <div className='detail_btns'>

                                        <div className="audio_warp" style={{ display: this.state.fileaudioshow ? "none" : "" }}>
                                            <audio src={audiosrc} controls="controls" id="audio">Your browser does not support the audio tag.</audio>
                                            <p className="add" onClick={this.del_img.bind(this, 0)}>删除</p>
                                        </div>


                                    </div>
                                </div>
                                <div className="input-group countrys">
                                    <span className="input-group-addon">题目类型</span>
                                    <div className="countryname" onChange={this.inputchangeradio.bind(this, 'type')}>
                                        <div className="radio"><input type="radio" name="type" value='FOLLOWUP' id='1' /><label for='1'></label><span>跟读</span></div>
                                        <div className="radio"><input type="radio" name="type" value='CHOICE' id='2' /><label for='2'></label><span>选择</span></div>

                                    </div>
                                </div>

                                {/* 跟读 */}
                                <div style={{ display: type == 'FOLLOWUP' ? "" : "none" }}>
                                    {/* <div className="input-group">
                                        <span className="input-group-addon">跟读内容</span>
                                        <input id='name' onChange={this.inputchange.bind(this, 'contents')} value={contents} type="text" placeholder='请输入跟读内容' className="input" />
                                    </div> */}

                                    <div className="input-group countrys">
                                        <span className="input-group-addon">评估模式</span>
                                        <div className="countryname" onChange={this.inputchangeradio.bind(this, 'evalmode')}>
                                            <div className="radio"><input type="radio" name="evalmode" value='0' id='evalmode1' /><label for='evalmode1'></label><span>词模式</span></div>
                                            <div className="radio"><input type="radio" name="evalmode" value='1' id='evalmode2' /><label for='evalmode2'></label><span>句子模式</span></div>
                                            <div className="radio"><input type="radio" name="evalmode" value='2' id='evalmode3' /><label for='evalmode3'></label><span>段落模式</span></div>

                                        </div>
                                    </div>
                                    <div className="input-group countrys">
                                        <span className="input-group-addon">评估语言</span>
                                        <div className="countryname" onChange={this.inputchangeradio.bind(this, 'servertype')}>
                                            <div className="radio"><input type="radio" name="servertype" value='0' id='servertype1' /><label for='servertype1'></label><span>英文</span></div>
                                            <div className="radio"><input type="radio" name="servertype" value='1' id='servertype2' /><label for='servertype2'></label><span>中文</span></div>

                                        </div>
                                    </div>
                                    <div className="input-group">
                                        <span className="input-group-addon">跟读内容</span>
                                        <textarea id='name' onChange={this.inputchange.bind(this, 'contents')} value={contents} type="text" placeholder='请输入跟读内容' className="textarea" rows="3"></textarea>
                                        {/* <textarea id={'ueditor'} style={{ height: "30vh" }} ></textarea> */}
                                    </div>
                                    <div className="input-group">
                                        <span className="input-group-addon">跟读内容翻译</span>
                                        <textarea id='name' onChange={this.inputchange.bind(this, 'translate')} value={translate} type="text" placeholder='请输入跟读内容翻译' className="textarea" rows="3"></textarea>
                                        {/* <textarea id={'ueditor'} style={{ height: "30vh" }} ></textarea> */}
                                    </div>
                                    {/* <div className="input-group">
                                        <span className="input-group-addon">跟读内容音标</span>
                                        <input id='name' onChange={this.inputchange.bind(this, 'vocabulary')} value={vocabulary} type="text" placeholder='请输入跟读内容音标' className="input" />
                                    </div> */}
                                </div>
                                {/* 跟读 end */}
                                {/* 跟读 */}
                                <div style={{ display: type == 'FOLLOWUP' ? "none" : "" }}>
                                    <div className="input-group">
                                        <span className="input-group-addon">题目</span>
                                        <input id='name' onChange={this.inputchange.bind(this, 'title')} value={title} type="text" placeholder='请输入题目' className="input" />
                                    </div>
                                    <div className="input-group">
                                        <span className="label input-group-addon">选项A</span>
                                        <input onChange={this.filechangeimg.bind(this, 'A')} type='file' id='fileA' style={{ display: "none" }} />
                                        <div className=''>
                                            <img className='fileimg' src={Constant.UPLOADBTN} onClick={this.clickupload.bind(this, 'A')} style={{ display: optionA ? "none" : "" }} />
                                            <div className="img_warp" style={{ display: optionA ? "" : "none" }}>
                                                <img src={optionA} className="img" />
                                                <img className='closeimg' onClick={this.del_img.bind(this, 'A')} src='./src/img_close.png' />
                                            </div>
                                        </div>
                                    </div>
                                    <div className="input-group">
                                        <span className="label input-group-addon">选项B</span>
                                        <input onChange={this.filechangeimg.bind(this, 'B')} type='file' id='fileB' style={{ display: "none" }} />
                                        <div className=''>
                                            <img className='fileimg' src={Constant.UPLOADBTN} onClick={this.clickupload.bind(this, 'B')} style={{ display: optionB ? "none" : "" }} />
                                            <div className="img_warp" style={{ display: optionB ? "" : "none" }}>
                                                <img src={optionB} className="img" />
                                                <img className='closeimg' onClick={this.del_img.bind(this, 'B')} src='./src/img_close.png' />
                                            </div>
                                        </div>
                                    </div>
                                    <div className="input-group">
                                        <span className="label input-group-addon">选项C</span>
                                        <input onChange={this.filechangeimg.bind(this, 'C')} type='file' id='fileC' style={{ display: "none" }} />
                                        <div className=''>
                                            <img className='fileimg' src={Constant.UPLOADBTN} onClick={this.clickupload.bind(this, 'C')} style={{ display: optionC ? "none" : "" }} />
                                            <div className="img_warp" style={{ display: optionC ? "" : "none" }}>
                                                <img src={optionC} className="img" />
                                                <img className='closeimg' onClick={this.del_img.bind(this, 'C')} src='./src/img_close.png' />
                                            </div>
                                        </div>
                                    </div>
                                    <div className="input-group">
                                        <span className="label input-group-addon">选项D</span>
                                        <input onChange={this.filechangeimg.bind(this, 'D')} type='file' id='fileD' style={{ display: "none" }} />
                                        <div className=''>
                                            <img className='fileimg' src={Constant.UPLOADBTN} onClick={this.clickupload.bind(this, 'D')} style={{ display: optionD ? "none" : "" }} />
                                            <div className="img_warp" style={{ display: optionD ? "" : "none" }}>
                                                <img src={optionD} className="img" />
                                                <img className='closeimg' onClick={this.del_img.bind(this, 'D')} src='./src/img_close.png' />
                                            </div>
                                        </div>
                                    </div>
                                    <div className="input-group">
                                        <span className="input-group-addon">选项正确答案</span>
                                        <div className="countryname" onChange={this.inputchangeradio.bind(this, 'rightkey')}>
                                            <div className="radio"><input type="radio" name="rightkey" value='A' id='rightkey1' /><label for='rightkey1'></label><span>选项A</span></div>
                                            <div className="radio"><input type="radio" name="rightkey" value='B' id='rightkey2' /><label for='rightkey2'></label><span>选项B</span></div>
                                            <div className="radio"><input type="radio" name="rightkey" value='C' id='rightkey3' /><label for='rightkey3'></label><span>选项C</span></div>
                                            <div className="radio"><input type="radio" name="rightkey" value='D' id='rightkey4' /><label for='rightkey4'></label><span>选项D</span></div>
                                        </div>
                                    </div>
                                </div>
                                {/* 跟读 end */}

                                {/* <div className="input-group">
                                    <span className="input-group-addon">描述</span>
                                    <textarea id='describe' onChange={this.inputchange.bind(this, 'describe')} value={describe} className="describe" placeholder='请输入描述' rows="10"></textarea>
                                </div> */}

                                <div className='submitbox'>
                                    <button type="button" onClick={this.submit.bind(this)} className="submitbutton">保存</button>
                                    <button type="button" onClick={this.toback.bind(this)} className="submitbutton" style={{ marginLeft: '100' }}>返回</button>
                                </div>
                            </div>
                        </div>
                    </div>


                </div>
            </div>





        )


    }
}





ReactDOM.render(
    <div>
        <TopLine />
        <div id='body'>
            <LeftMenu code='testpaper' />
            <Main />
        </div>
    </div>
    // <Barrage/>
    , $('.container')[0]
)
